<template>
  <div class="layout">
        <Layout>
          <div style="z-index:99">
            <Header  :style="{position: 'fixed', width: '100%'}" class="layout-header-bar">
                <headerBox></headerBox>
            </Header>
          </div>
           
            <Content  :style="{margin: '88px 20px', padding:'24px', background: '#fff', minHeight: '100px'}">
              <router-view/>
            </Content>
            <!-- <Footer :style="{position: 'fixed', bottom: '0', width: '100%'}" class="layout-footer-center">2021 &copy; 智能投顾</Footer> -->
        </Layout>
    </div>
</template>

<script>
import headerBox from './header'
export default {
  components: { headerBox },
  name: 'HelloWorld',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  }
}
</script>

<style scoped>
.layout{
    border: 1px solid #d7dde4;
    min-height: 100vh;
    background: #f5f7f9;
    position: relative;
    border-radius: 4px;
    overflow: hidden;
}
</style>

